import { useEffect, useState } from 'react';
import styles from './index.module.less';
import { handleNan } from '@/utils';

export default function BaoZhengJin({ keYongMoney, price, coinData, lever, num, unit }: any) {
  const [baoZhengJin, setBaoZhengJin] = useState<any>({});
  const [qiangPing, setQiangPing] = useState<any>({});
  const [zuoDuoNum, setZuoDuoNum] = useState<any>();
  const [zuoKongNum, setZuoKongNum] = useState<any>();
  const isZhang = unit === 'zhang'; // 单位是否是zhang

  useEffect(() => {
    if (!coinData?.quanto_multiplier || !coinData?.taker_fee_rate) return;
    //  保证金:usdt数量需要转化为张 size = usdt数量 / ( 价格 * 乘数 )
    const newPrice = Number(price);
    const chengShu = Number(coinData?.quanto_multiplier);
    const newNum = isZhang ? Number(num) : Number(num / (newPrice * chengShu));
    const priceNum = newPrice * chengShu * newNum;
    const duo = priceNum / lever + priceNum * Number(coinData?.maker_fee_rate);
    const kong = priceNum / lever + priceNum * Number(coinData?.taker_fee_rate);
    // 做多做空数量: 临时=可用资金 * 倍数 * 98%, 做空=做多 * 98%
    const duoNum = keYongMoney * lever * 0.985;
    setZuoDuoNum(duoNum.toFixed(2));
    setZuoKongNum((duoNum * 0.99).toFixed(2));
    /*
    预估强平价 =（开仓均价 ± 保证金 / 合约乘数 / 仓位数量）/ [ 1±（ 维持保证金率 + Taker费率）]
    逐仓保证金 = 逐仓仓位占用保证金  
    */
    // 预估强平价
    const baoZhengNum = duo / chengShu / newNum;
    const feiLv = Number(coinData?.maintenance_rate) + Number(coinData?.taker_fee_rate);
    const qiangPignDuo = (newPrice - duo / chengShu / newNum) / (1 - feiLv);
    const qiangPignKong = (newPrice + kong / chengShu / newNum) / (1 + feiLv);
    setBaoZhengJin({ duo, kong });
    setQiangPing({ duo: qiangPignDuo, kong: qiangPignKong });
  }, [keYongMoney, price, coinData, lever, num]);

  return (
    <>
      <div className={`${styles.orderDescw}`}>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>可做多</div>
          <div className={`${styles.dnum} xxx`}>{zuoDuoNum} USDT</div>
        </div>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>可做空</div>
          <div className={`${styles.dnum} xxx`}>{zuoKongNum} USDT</div>
        </div>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>保证金</div>
          <div className={`${styles.dnum} xxx`}>{handleNan(baoZhengJin?.duo)} USDT</div>
        </div>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>保证金</div>
          <div className={`${styles.dnum} xxx`}>{handleNan(baoZhengJin?.kong)} USDT</div>
        </div>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>预估强平价</div>
          <div className={`${styles.dnum} xxx`}>{handleNan(qiangPing?.duo)}</div>
        </div>
        <div className={`${styles.ditem}`}>
          <div className={`${styles.name} xxx`}>预估强平价</div>
          <div className={`${styles.dnum} xxx`}>{handleNan(qiangPing?.kong)}</div>
        </div>
      </div>
    </>
  );
}
